<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@include file="/WEB-INF/base.jspf"%>
<!DOCTYPE html>
<html>
<head>
<title>白名单用户管理</title>
<style>
	#table-baimingdan {
		margin-top:16px;
	}
	.hidden-td {
		display:none;
	}
		.modal-dialog {
		max-width: 1000px;
	}
	table th,table tr,table td {
	text-align: center;
	vertical-align:middle;
}
</style>
</head>
<body>
<!-- /.modal -->	
<div class="modal fade" id="noticeModal" tabindex="-1" style="z-index:1070" role="dialog" aria-labelledby="noticeModal" aria-hidden="true">
    <div class="modal-dialog class-fake-alert">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            </div>
            <div class="modal-body" ></div>
            <div class="modal-footer">	      
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>   	
	<div><button class="btn btn-primary" data-toggle="modal" data-target="#addNewIpBaiMingDan">新增</button></div>
	<table id="table-baimingdan" class="class-tableDataTable table-normal-datatables table table-striped table-bordered table-hover">
		<thead>
			<tr>
				<th style="display:none;"></th>
				<th>白名单IP</th>
				<th>IP状态</th>
				<th>创建时间</th>
				<th>IP操作</th>
			</tr>
		</thead>
		<tbody>
		</tbody>
	</table>
<!-- 模态框（Modal） -->
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            </div>
            <div class="modal-body">你确定要删除该IP吗？</div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" id="btn-i-delModalBtn">删除</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>
<!-- /.modal -->		
<!-- 模态框（Modal） -->
<div class="modal fade" id="addNewIpBaiMingDan" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel">添加白名单IP</h4>
            </div>
            <div class="modal-body">
            	<input class="form-control" id="input-i-newIP" placeholder="请输入新的IP地址" />
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" id="btn-i-addNewWhiteIp">提交更改</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>

<script type="text/javascript" src="/js/zhengzeTools.js"></script>
	<script>
		$(".table-normal-datatables").on("click", ".btn-deleteBaiMingDanItem", function(event) {
			$("#deleteModal").modal("show")
		})
		bindDelItemEvent("#table-baimingdan", ".btn-deleteBaiMingDanItem","/admin/deleteWhiteList.do")
		bindJinYongQiYongSwitch("#table-baimingdan","/admin/editWhiteListStatus.do", "status")	
		var dataTable = $("#table-baimingdan").DataTable({
		      // "bPaginate": true,
		      "bLengthChange": true,      
		      "bSort": false,
		      "bAutoWidth": false,
		      'aLengthMenu':[5, 20],
		       "searching": false,
		       "dom": "t<'tableinfo'i<'tableSearch'p>l>",
		       "language": {//语言设置  
		            "lengthMenu": "每页显示 _MENU_ 条记录",     
		            "zeroRecords": "没有检索到数据",     
		            "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",     
		            "info": "没有数据",     
		            "oPaginate": {     
		                "sFirst": "首页",     
		                "sPrevious": "前一页",     
		                "sNext": "后一页",     
		                "sLast": "尾页"    
		          	},
		            "search":"搜索:",
		            "infoFiltered":   "(从  _MAX_ 记录中搜索出结果)",
		            "infoEmpty":      "没有找到匹配的信息",
		         },
		         "drawCallback": function( settings ) {
		        	 $(".input-c-mySwitch").bootstrapSwitch()
		         },
		         "ajax": {
		        	 "type": "POST",
		        	 "url": "/admin/findAllWhiteList.do",
		        	 "dataSrc": function(json) {
		        		 var newJson = json.data
		        		 for (var i = 0; i < newJson.length; i++) {
		         			 var item = newJson[i]
		         			 var stateValue = ""
		        			 if (item.status == "1") {
		        				 stateValue = "checked"
		        			 } else {
		        				 stateValue = ""
		        			 }
		        		 	item.status = "<input class='input-c-mySwitch' data-size='small' type='checkbox' " + stateValue + " data-on-text='启用' data-on-color='success' data-off-color='danger' data-off-text='禁用' />"
		        		 }
		        		 return newJson
		        	 },
		         },
 		         "columns": [
							 {"data": "id", "className": "hidden-td id-edit-td"},
		                     {"data": "ip", "className": "zhanhao-edit-td"},
		                     {"data": "status", "className": "zhenshixingming-edit-td"},
		                     {"data": "createdTime", "className": "phone-edit-td"},
		                     {"data": null, "defaultContent": "<button class='btn btn-danger btn-deleteBaiMingDanItem btn-sm'>删除</button>"},
		                 ]      
		   		 })
		   		 insertSearchBtn()
		   		 $("#btn-i-addNewWhiteIp").on("click", function(event) {
		   			 var value = $("#input-i-newIP").val()
		   			 var isValidIP = checkIP(value)
		   			 if (!isValidIP) {
		   				showNoticeModal("无效的IP地址")
		   			 	return
		   			 }
		   			var newRequest = {
		   				url: "/admin/addWhiteListUser.do",
		   				type: "post",
		   				data: {
		   					ip: $("#input-i-newIP").val(),
		   				},
		   				success: function(data) {
		   					var newData = JSON.parse(data)
		   					if (newData.data == "1") {
			   					showNoticeModal("添加IP成功！")
			   					$("#addNewIpBaiMingDan").modal("hide")
			   					dataTable.ajax.reload()		   						
		   					}
		   					else {
		   						showNoticeModal(newData.message)
		   					}
		   				},
		   				error: function(status) {
		   					showNoticeModal("添加IP失败！")
		   				}
		   			}
		   			ajax(newRequest)		   			 
		   		 })
	</script>
</body>
</html>